<!--
 * @Description: 项目管理-发起项目-项目权限
 * @Author gong
 * @create 2024/9/4 17:27
 -->
<!--setup-->
<script setup>
import { onMounted, getCurrentInstance } from 'vue'
import { to } from 'sf-utils2'
import { ElMessage } from 'element-plus'
import BaseQueryTable from '@shared/base/base-query-table' // 表格共公共组件
import { useBaseQueryTable } from '@shared/base/base-query-table/use-table' // 表格共公共组件
import BaseTag from '@shared/base/base-tag' // 公共标签组件
import prjInfoApi from '@/api/modules/prj-info'

const { proxy } = getCurrentInstance()
const props = defineProps({
  projectInfo: {
    type: Object,
    default: () => ({})
  }
})
const emit = defineEmits([])

/* 状态 */
const queryTable = useBaseQueryTable({
  columns: [
    { label: '用户姓名', prop: 'userName', minWidth: 80 },
    { label: '工号', prop: 'empCode', minWidth: 120 },
    { label: '所属机构/部门', prop: 'deptName', minWidth: 100 },
    { label: '角色', prop: 'roleName', minWidth: 100 },
    { label: '手机号码', prop: 'mobile', minWidth: 100 },
    { label: '授权时间', prop: 'createTime', minWidth: 100, isDate: true }
  ],
  // isViewportFitHeight: true,
  onQuery: async (mark) => {
    const { pageNum, pageSize } = mark
    const prjId = props.projectInfo.id

    const [res, err] = await to(prjInfoApi.getPrjPerUserListByPage({ pageNum, pageSize, prjId }))
    if (err || res?.code !== 200) return ElMessage.error(res?.message || String(err))
    mark.total = res?.data?.total
    return {
      dataList: res?.data?.dataList || [],
      mark
    }
  }
})

/* 方法 */

/* 计算 */

/* 监听 */

/* 周期 */
onMounted(() => {})

/* 暴露 */
defineExpose({
  $: proxy.$
})
</script>

<!--render-->
<template>
  <div class="open-auth">
    <!-- 内容区 -->
    <div class="title">
      <span>授权人员名单</span>
      <!-- permissionType（权限类型）10-公开权限，20-部分权限 -->
      <BaseTag
        :type="projectInfo.permissionType === '10' ? 'green' : 'orange'"
        class="title-tag"
      >
        {{ projectInfo.permissionType === '10' ? '公开授权' : '部分授权' }}
      </BaseTag>
    </div>
    <BaseQueryTable
      v-if="projectInfo.permissionType === '20'"
      v-bind="queryTable"
      ref="baseQueryTableRef"
    />
  </div>
</template>

<!--style-->
<style scoped lang="less">
.open-auth {
  padding: 16px;
  margin-top: 16px;
  background: @white;
  border-radius: 6px;

  .title {
    display: flex;
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: bold;
    color: #333;
    align-items: center;

    .title-tag {
      height: 20px;
      margin-left: 8px;
      font-size: 12px;
      font-weight: 400;
      line-height: 20px;
    }
  }
}
</style>
